/*body{*/
/*    height: 100%;*/
/*    weight:100%;*/
/*}*/
.left_div{
    position: absolute;
    height: 700px;
    width: 220px;
    z-index: 1;
}

ul li{
    list-style: none;
}

.avatar2{
    height: 29%;
    background: url(http://i.mooc.chaoxing.com/style/defstyle/images/personalBg.jpg) no-repeat #faf7f5 bottom center;
    padding-top: 15px;
    text-align: center;
    position: absolute;
    width: 220px;
    left: 2%;
}

.avatar2>div:first-child{
    display: block;
    width: 100%;
    height: 80px;
    border-radius: 100%;
    overflow: hidden;
    margin: 0 auto;
}

.avatar2>div:last-child{
    width: 100%;
    height: 80px;
    margin-top: 20px;
    padding: 0;
    -webkit-tap-highlight-color: rgba(0,0,0,0);

    font-size: 20px;
}

.avatar_{
    width: 80px;
    height: 80px;
    margin:0 auto;
    border-radius: 100%;

    background: url("http://photo.chaoxing.com/p/147599127_80?temp=1637845713805") no-repeat;
}

.list{
    z-index: 1;
    position: absolute;
    height: 69%;
    width: 100%;
    left: 59%;
    top:31%;
    background-color: ghostwhite;
}

.left_ul{
    margin-top: 20px;
}

.left_ul li{
    min-height: 41px;
    overflow: hidden;
    position: relative;

    font-size: 16px;
    line-height: 41px;
}
.left_ul li div{
    vertical-align: middle;
    margin-left: 10px;
    margin-right: 10px;
    float: left;
    width: 22px;
    height: 20px;
    margin-top: 10px;

    background: url("http://i.mooc.chaoxing.com/style/defstyle/images/yunicon.png?temp=20190530");
}


.right_div{
    position: absolute;
    z-index: 1;
    height: 700px;
    width: 1037px;
    background-color: #bac2c9;
    left: 225px;
}

